<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<link rel="stylesheet" type="text/css" href="css/jquery.mCustomScrollbar.css">
	<style type="text/css">
		.content{
			width: 300px;
			height: 300px;
			overflow-y: hidden;
		}
	</style>
</head>
<body>
	<div class="mCustomScrollbar content" data-mcs-theme="rounded-dots-dark">
	  <ul>
	  	<li>item1</li>
	  	<li>item2</li>
	  	<li>item3</li>
	  	<li>item4</li>
	  	<li>item5</li>
	  	<li>item6</li>
	  	<li>item7</li>
	  	<li>item8</li>
	  	<li>item9</li>
	  	<li>item10</li>
	  	<li>item11</li>
	  	<li>item12</li>
	  	<li>item13</li>
	  	<li>item14</li>
	  	<li>item15</li>
	  	<li>item16</li>
	  	<li>item17</li>
	  	<li>item18</li>
	  	<li>item19</li>
	  	<li>item20</li>
	  </ul>
	</div>
	
	<script type="text/javascript" src="js/jquery.js"></script>
	<script type="text/javascript" src="js/jquery.mCustomScrollbar.concat.min.js"></script>
	<script type="text/javascript">
		(function($){
	        $(window).on("load",function(){
	            $(".content").mCustomScrollbar();
	        });
	    })(jQuery);
	</script>
</body>
</html>